<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>首页</title>
  <link href="../../layuiadmin/js/adm/css/bootstrap.css" rel="stylesheet">
  <script src="../../layuiadmin/js/adm/js/vue.js"></script>
  <script src="../../layuiadmin/js/adm/js/vue-resource.js"></script>
  <script src="../../layuiadmin/js/adm/js/jquery.min.js"></script>
  <script src="../../layuiadmin/js/adm/js/bootstrap.js"></script>
  <script src="../../layuiadmin/js/adm/js/getUrlParam.js"></script>
  <script src="../../layuiadmin/js/adm/js/date.js"></script>
  <!-- 引入样式 -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui@1.4/lib/theme-default/index.css">
  <!-- 引入组件库 -->
  <script src="https://unpkg.com/element-ui@1.4/lib/index.js"></script>
  <script src="../../layuiadmin/js/adm/js/jquery.cookie.js"></script>
  <!-- 引入样式 -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!-- 引入组件库 -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
<div id="app" class="container-fluid">
  <div class="row" style="border-bottom:1px solid silver" >
    <div class="col-md-4" style="border-right: 1px solid silver;height: 200px;">
      <h4 style="size: 30px;margin-top: 20px"><b><span style="color:rgb(64, 137, 233)">丨</span>案件统计</b></h4>
      <table style="margin-top: 25px;margin-left: 30px;width: 400px">
        <tr style="text-align: center">
          <td >
            <span style="color:rgb(64, 137, 233);font-size: 40px">{{backlog}}</span>
            <br>审批中
          </td>
          <td>
            <span style="color:rgb(64, 137, 233);font-size: 40px">{{backlogl}}</span>
            <br>在办
          </td>
          <td>
            <span style="color:rgb(64, 137, 233);font-size: 40px">{{settle}}</span>
            <br>结案
          </td>
          <td>
            <span style="color:rgb(64, 137, 233);font-size: 40px">{{settle2}}</span>
            <br>待办事项
          </td>
        </tr>
      </table>
    </div>
    <div class="col-md-8" style="height: 200px;padding-left: 80px">
      <h4 style="size: 30px;margin-top: 20px"><b><span style="color:rgb(64, 137, 233)">丨</span>代收款案件列表</b></h4>
      <table class="table table-condensed" style="width: 90%;margin-left: 30px" >
        <thead>
        <tr>
          <th>案号</th>
          <th>案由</th>
          <th>委托人</th>
          <th>费用</th>
          <th>已收款</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="item in law">
          <td>{{item.caseId}}</td>
          <td>{{item.causeOfAction}}</td>
          <td>{{item.clientId.clientName}}</td>
          <td>{{item.amountMoney}}</td>
          <td>{{item.realityMoney}}</td>
        </tr>
        </tbody>
      </table>
    </div>
  </div>
  <div class="row" >
    <div class="col-md-9" style=" height: 640px;padding: 0 60px;border-right: 1px solid silver">
      <h4 style="size: 30px;"><b><span style="color:rgb(64, 137, 233)">丨</span>日历</b></h4>
      <el-calendar v-model="value">
      </el-calendar>
    </div>
    <div class="col-md-3" style=" height: 640px;padding: 0 0 0 25px;">
      <div class="row" style="height: 30%">
        <h4 style="size: 30px;margin-top: 20px"><b><span style="color:rgb(64, 137, 233)">丨</span>通知公告</b></h4>
        <p style="margin-left: 30px" v-for="item in notice">{{item.title}}</p>
      </div>
      <div class="row" style="height: 70%;">
        <h4 style="size: 30px;margin-top: 20px"><b><span style="color:rgb(64, 137, 233)">丨</span>审批中心</b></h4>
        <div v-for="item in audit" style="margin: 10px 20px">
          <b>事项：</b><span style="color: silver">{{item.typeid.typeName}}</span><br>
          <b>状态：</b><span style="color: silver">{{item.state}}</span><br>
          <b>提交时间：</b><span style="color: silver">{{item.submitTime}}</span><br>
        </div>
      </div>
    </div>
  </div>

</div>


<script>
  var vm=new Vue({
    el:'#app',
    data:{
      law:[],
      notice:[],
      audit:[],
      value:new Date(),
      backlog:"0",
      backlogl:"0",
      settle:"0",
      settle2:"0",
      uname:"<br>",
      signtm:{}
    },
    methods: {
      postlaw(){
        this.$http.post('http://localhost:8080/home/law',{},{emulateJSON:true}).then(resutl =>{
          var dat=eval("("+resutl.body+")")
          this.law=new Array()   //每次重新new一个list集合给定义的list集合
          for(var i=0;i<dat.length;i++){
            this.law.push(dat[i])
          }
        })
      },
      postnotice(){
        this.$http.post('http://localhost:8080/home/notice',{},{emulateJSON:true}).then(resutl =>{
          var dat=eval("("+resutl.body+")")
          this.notice=new Array()   //每次重新new一个list集合给定义的list集合
          for(var i=0;i<dat.length;i++){
            this.notice.push(dat[i])
          }
        })
      },
      postaudit(){
        this.$http.post('http://localhost:8080/home/audit',{},{emulateJSON:true}).then(resutl =>{
          var dat=eval("("+resutl.body+")")
          this.audit=new Array()   //每次重新new一个list集合给定义的list集合
          for(var i=0;i<dat.length;i++){
            this.audit.push(dat[i])
          }
        })
      },
      post1(){
        this.$http.post('http://localhost:8080/home/backlog',{},{emulateJSON:true}).then(resutl =>{
          this.backlog=resutl.body
        })
      },
      post2(){
        this.$http.post('http://localhost:8080/home/backlogl',{},{emulateJSON:true}).then(resutl =>{
          this.backlogl=resutl.body
        })
      },
      post3(){
        this.$http.post('http://localhost:8080/home/settle',{},{emulateJSON:true}).then(resutl =>{
          this.settle=resutl.body
        })
      },
      post4(){
        var userId=$.cookie("redisId");
        this.$http.post('http://localhost:8080/home/settle2',{"userId":userId},{emulateJSON:true}).then(resutl =>{
          this.settle2=resutl.body
        })
      },
    //  签到
      postinsert(){
        var userId=$.cookie("redisId");
        this.$http.post('http://localhost:8080/home/insert',{"userId":userId},{emulateJSON:true}).then(resutl =>{
          if(resutl.body!=""&&resutl.body!=null){
            var dat=eval("("+resutl.body+")");
            if(dat!=null&&dat!=""){
              this.signtm=dat
              if(this.signtm.state=="正常"){
                this.open3()
              }else if(this.signtm.state=="迟到"){
                this.open4()
              }else if(this.signtm.state=="旷工"){
                this.open5()
              }
            }
          }
        })
      },
      open3() {
        this.$message({
          showClose: true,
          message: this.signtm.uname+'：签到成功！',
          type: 'success'
        });
      },open4() {
        this.$message({
          showClose: true,
          message: "签到成功"+"   "+this.signtm.uname+'   迟到:'+this.signtm.time+"分钟",
          type: 'warning'
        });
      },open5() {
        this.$message({
          showClose: true,
          message:"签到成功"+"   "+this.signtm.uname+'：旷工！',
          type: 'error'
        });
      }
    },
    created () {
      this.postlaw()
      this.postnotice()
      this.postaudit()
      this.post1()
      this.post2()
      this.post3()
      this.post4()
      this.postinsert()
    }
  })
</script>
</body>
</html>